<template>
    <div class="index-container">
        <el-affix target=".index-container" :offset="0">
            <el-header class="header-part">
                <navigation-bar/>
            </el-header>
        </el-affix>
        <el-main class="main-part">
            <RouterView/>
        </el-main>
    </div>
</template>

<script setup lang="ts">
import NavigationBar from '@/components/NavigationBar.vue';
</script>

<style scoped>

.index-container {
    width: 100%;
    height: 100vh;
    background-color: rgb(240, 240, 241);
    overflow: hidden;

    .header-part {
        background-color: rgb(115, 32, 32);
        width: 100%;
        height: 55px;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
        background-color: rgb(255, 255, 255);
    }

    .main-part {
        width: 100%;
        margin: 0 auto;
        margin-top: 5px;
        padding: 0px;
    }
}

</style>